<template>
	<view>
		<view style="margin-left: 20rpx;margin-top: 20rpx; width:710rpx;height:710rpx;background: gray;">
			<image class="banner" mode="aspectFit" :show-menu-by-longpress="true"
				src="https://imgs-qn.iliangcang.com/ware/slider/1908.jpg" />
		</view>

		<button class="shareBtn" type="default"
			@click="savePosterPath('https://imgs-qn.iliangcang.com/ware/slider/1908.jpg')">
			保存
		</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			savePosterPath(url) {
				let that = this;
				uni.showLoading({
					title: '正在保存图片...'
				});
				//获取用户的当前设置。获取相册权限
				uni.getSetting({
					success: (res) => {
						//如果没有相册权限
						if (!res.authSetting["scope.writePhotosAlbum"]) {
							//向用户发起授权请求
							uni.authorize({
								scope: "scope.writePhotosAlbum",
								success: () => {
									//授权成功保存图片到系统相册
									uni.hideLoading();
									that.saveNetImageToLocal(url);
								},
								//授权失败
								fail: () => {
									uni.hideLoading();
									uni.showToast({
										title: "未授权保存图片到相册！",
									});
								},
							});
						} else {
							that.saveNetImageToLocal(url);
						}
					},
					fail: (res) => {},
				});
			},
			//保存网络图片到本地
			saveNetImageToLocal(url) {
				uni.downloadFile({
					url: url,
					success: (res) => {
						if (res.statusCode === 200) {
							uni.saveImageToPhotosAlbum({
								filePath: res.tempFilePath,
								success: (res) => {
									uni.hideLoading();
									return uni.showToast({
										title: "保存成功！",
									});
								},
								fail: (res) => {
									uni.hideLoading();
									console.log(res.errMsg);
									return uni.showToast({
										title: res.errMsg,
									});
								},
								//无论成功失败都走的回调
								complete: (res) => {
									uni.hideLoading();
								},
							});
						} else {
							uni.showToast({
								title: '网络错误',
							});
						}
					}
				});
			},
		}
	}
</script>

<style>
	.banner {
		width: 100%;
		height: 100%;
	}
</style>